.amplify-dropzone {
  display: block;
  background-color: var(--amplify-components-dropzone-background-color);
  border-color: var(--amplify-components-dropzone-border-color);
  border-width: var(--amplify-components-dropzone-border-width);
  border-style: var(--amplify-components-dropzone-border-style);
  border-radius: var(--amplify-components-dropzone-border-radius);
  color: var(--amplify-components-dropzone-color);
  padding-block: var(--amplify-components-dropzone-padding-block);
  padding-inline: var(--amplify-components-dropzone-padding-inline);
  text-align: var(--amplify-components-dropzone-text-align);

  &--disabled {
    cursor: not-allowed;
    background-color: var(
      --amplify-components-dropzone-disabled-background-color
    );
    border-color: var(--amplify-components-dropzone-disabled-border-color);
    border-width: var(--amplify-components-dropzone-disabled-border-width);
    border-style: var(--amplify-components-dropzone-disabled-border-style);
    border-radius: var(--amplify-components-dropzone-disabled-border-radius);
    color: var(--amplify-components-dropzone-disabled-color);
  }

  &--active {
    background-color: var(
      --amplify-components-dropzone-active-background-color
    );
    border-color: var(--amplify-components-dropzone-active-border-color);
    border-width: var(--amplify-components-dropzone-active-border-width);
    border-style: var(--amplify-components-dropzone-active-border-style);
    border-radius: var(--amplify-components-dropzone-active-border-radius);
    color: var(--amplify-components-dropzone-active-color);
  }

  &--rejected {
    background-color: var(
      --amplify-components-dropzone-rejected-background-color
    );
    border-color: var(--amplify-components-dropzone-rejected-border-color);
    border-width: var(--amplify-components-dropzone-rejected-border-width);
    border-style: var(--amplify-components-dropzone-rejected-border-style);
    border-radius: var(--amplify-components-dropzone-rejected-border-radius);
    color: var(--amplify-components-dropzone-rejected-color);
  }

  &--accepted {
    background-color: var(
      --amplify-components-dropzone-accepted-background-color
    );
    border-color: var(--amplify-components-dropzone-accepted-border-color);
    border-width: var(--amplify-components-dropzone-accepted-border-width);
    border-style: var(--amplify-components-dropzone-accepted-border-style);
    border-radius: var(--amplify-components-dropzone-accepted-border-radius);
    color: var(--amplify-components-dropzone-accepted-color);
  }
}
